package org.kmp.project.main

import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.material3.Badge
import androidx.compose.material3.BadgedBox
import androidx.compose.material3.BottomAppBar
import androidx.compose.material3.Icon
import androidx.compose.material3.IconButton
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Scaffold
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.LaunchedEffect
import androidx.compose.runtime.MutableIntState
import androidx.compose.runtime.mutableIntStateOf
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.vector.ImageVector
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import androidx.lifecycle.viewmodel.compose.viewModel
import org.jetbrains.compose.resources.vectorResource
import org.kmp.project.INavElement
import org.kmp.project.main.account.Account

import org.kmp.project.main.fav.Favorite
import org.kmp.project.main.home.Home
import org.kmp.project.resources.Res
import org.kmp.project.resources.v_home



class Main : INavElement{


    val TAG="Main"

    data class BottomItem(
        val title: String,
        val icon: ImageVector,
        var badgeCount: MutableIntState = mutableIntStateOf(0),
        val content: @Composable () -> Unit
    )

    override fun tag(): String{
        return TAG
    }

    private val home= Home()
    private val fav= Favorite()
    private val account= Account()

    @Composable
    override fun screen() {

        val viewModel: MainViewModel = viewModel()

        val ic_home = vectorResource(Res.drawable.v_home)

        // 初始化 BottomItem，只在第一次执行
        LaunchedEffect(Unit) {
            viewModel.setBottoms(
                listOf(
                    BottomItem(
                        title = "首页",
                        icon = ic_home,
                        content = { home.screen() }
                    ),
                    BottomItem(
                        title = "收藏",
                        icon = ic_home,
                        content = { fav.screen() }
                    ).apply { badgeCount.intValue = 5 },
                    BottomItem(
                        title = "我的",
                        icon = ic_home,
                        content = { account.screen() }
                    ).apply { badgeCount.intValue = 1 },
                )
            )
        }

        val selectedIndex = viewModel.selectedIndex
        val bottomItems = viewModel.bottomItems

        Scaffold(
            bottomBar = {
                BottomAppBar(
                    actions = {
                        bottomItems.forEachIndexed { index, item ->
                            val isSelected = selectedIndex == index
                            IconButton(
                                onClick = { viewModel.selectIndex(index) },
                                modifier = Modifier
                                    .weight(1f)
                                    .fillMaxSize()
                            ) {
                                BadgedBox(
                                    badge = {
                                        if (item.badgeCount.intValue > 0) {
                                            Badge {
                                                Text(
                                                    item.badgeCount.value.toString(),
                                                )
                                            }
                                        }
                                    }
                                ) {
                                    Column(
                                        horizontalAlignment = Alignment.CenterHorizontally,
                                    ) {
                                        Icon(
                                            modifier = Modifier.size(35.dp),
                                            imageVector = item.icon,
                                            contentDescription = item.title,
                                            tint = if (isSelected)
                                                MaterialTheme.colorScheme.primary
                                            else
                                                MaterialTheme.colorScheme.onSurfaceVariant
                                        )
                                        Text(
                                            text = item.title,
                                            fontSize = 12.sp,
                                            color = if (isSelected)
                                                MaterialTheme.colorScheme.primary
                                            else
                                                MaterialTheme.colorScheme.onSurfaceVariant
                                        )
                                    }
                                }
                            }
                        }
                    },
                )
            },
        ) { innerPadding ->
            Box(Modifier.fillMaxSize().padding(innerPadding)) {
                if (bottomItems.isNotEmpty()){
                    bottomItems[selectedIndex].content()
                }
            }
        }

    }



//@HotPreview(widthDp = 300, heightDp = 891, density = 2.625f)
//@Composable
//fun MainScreenPreview() {
//    MaterialTheme {
//        MainScreen()
//    }
//}

}

